<!DOCTYPE html>
<html>

<head>
<th:block th:replace="/fragments/head" />
</head>

<body class="dashboard-page sb-l-o">
	<!--/* 主题设置面板 */-->
	<div th:replace="/fragments/skin-toolbox"></div>

	<!-- BEGIN: 主页面 -->
	<div id="main">
		<!--/* 顶部导航 */-->
		<header th:replace="/fragments/header-banner"></header>
		<!--/* 左侧功能菜单导航 */-->
		<aside th:replace="/fragments/aside"></aside>
		<!-- BEGIN: Content-Wrapper -->
		<section id="content_wrapper">
			<!--/* 模块路径导航条 */-->
			<header th:replace="/fragments/header-breadcrumb"></header>

			<!-- Begin: 业务办理区 -->
			<!-- Begin: Content -->
			<section id="contents" class="animated fadeIn">

				<!-- Validation Example -->
				<!-- 新增参数窗口 -->
				<div id="w-add-param" class="popup-basic admin-form mfp-with-anim" data-effect="mfp-zoomOut">
					<div class="panel">
						<div class="panel-heading">
							<i class="fa fa-plus fa-2x"></i>
							<span class="panel-title ml5">新增键值参数</span>
						</div>
						<!-- end .panel-heading section -->
						<div class="panel-body">
							<form id="fo_add_param" class="form-horizontal" role="form">
								<div class="form-group">
									<label class="col-md-3 control-label required">所属系统：</label>
									<div class="col-md-9 field">
										<select name="sys_key" class="basic-single form-control" style="width: 250px">
											<option value="0">缺省全局</option>
										</select>
									</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label required">参数名称：</label>
									<div class="col-md-9 field">
										<input type="text" name="name" class="form-control" />
									</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label required">参数键：</label>
									<div class="col-md-9 field">
										<input class="form-control" type="text" name="param_key" />
									</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label required">参数值：</label>
									<div class="col-md-9 field">
										<input name="value" class="form-control" type="text" />
									</div>
								</div>
								<div class="form-group">
									<label class="col-md-3 control-label">备注</label>
									<div class="col-md-9 field">
										<textarea name="remark" class="form-control textarea-grow" rows="4"></textarea>
									</div>
								</div>
								<div class="panel-footer text-right">
									<button id="btn-save" class="button btn-primary">保存</button>
								</div>
							</form>
						</div>

					</div>
					<!-- end: .panel -->
				</div>
				<!-- end: 新增参数窗口 -->
				<!-- end: .admin-form -->

			</section>
			<!-- End: Content -->
			<!-- End: 业务办理区 -->

			<!--/* 页脚 */-->
			<footer th:replace="/fragments/footer"></footer>

		</section>
		<!-- End: Content-Wrapper -->

	</div>
	<!-- End: 主页面 -->

	<!--/* 公共脚本文件 */-->
	<th:block th:include="/fragments/scripts" />

	<script th:inline="javascript">
		/*<![CDATA[*/
		jQuery(document).ready(function() {
			"use strict";
			Core.init();

			$("#fo_add_param").validate({
				errorElement : "em",
				//校验规则
				rules : {
					name : {
						required : true
					},
					param_key : {
						required : true
					},
					sys_key : {
						required : true
					},
					value : {
						required : true
					}
				},
				//提示信息
				messages : {
					name : {
						required : '请输入参数名称'
					},
					param_key : {
						required : '请输入参数键'
					},
					sys_key : {
						required : '请选择所属系统'
					},
					value : {
						required : '请选择参数值'
					}
				},

				highlight : function(element, errorClass, validClass) {
					$(element).closest('.field').addClass('has-error');
				},
				success : function(element, errorClass, validClass) {
					$(element).closest('.field').removeClass('has-error');
				},
				errorPlacement : function(error, element) {
					if (element.is(":radio") || element.is(":checkbox")) {
						element.closest('.option-group').after(error);
					} else {
						error.insertAfter(element);
					}
				},
				submitHandler : function(form) {
					alert(1);
				}

			});

		});
		/*]]>*/
	</script>

</body>

</html>
